<template>
	<view>  
	        <view class="" v-if="JSON.stringify(confirm) !== '{}'">
	           <approverMsg :value="confirm"></approverMsg>			
	        </view> 
			<navigator class="left_box" v-if='wine[0].order_id' :url="'/pages/order/detail/detail?order_id='+wine[0].order_id">
				<text>查看定单详情</text>
			</navigator>
			<view class="hotelService" >
				<view class="" v-for="(itemW,indexW) in wine" :key="indexW">
					<view class="title">
						<text class="name">酒水信息({{indexW+1}})</text>
						<text class="delete" @click="deleteWine(indexW)">删除</text>
					</view>
					<view class="content">						
						<view class="box">
							<text>品牌</text>
							<picker @change="chooseWine"  :data-type="indexW" range-key="title" :range="wineList">
							    <view class="choose"  v-if="JSON.stringify(wineList)!='[]'">
									 <text :class="itemW.wineIndex!==''?'active':''">{{itemW.wineIndex===''?'请选择':wine[indexW].wine_text}}</text>
									 <image v-if="itemW.wineIndex===''" src="../../../static/images/right.png" mode=""></image>
							    </view>
							</picker>
							<icon class="icon" v-if="itemW.wineIndex!==''" type="clear" size="22upx"  @click="deleteJiu(indexW)"></icon>
						</view>
						<view class="box">
							<text>数量</text>
							<input type="digit" v-model="itemW.wine_amount"  placeholder="请输入" placeholder-style="color:#999999;" />
						</view>
						<view class="box">
							<text>金额</text>
							<input type="digit" v-model="itemW.wine_price"  placeholder="请输入" placeholder-style="color:#999999;" />
						</view>
						<view class="remark">
							<text>备注</text>
							<textarea type="text" v-model="itemW.wine_remark" placeholder="请输入备注" placeholder-style="color:#999999;" />
						</view>
					</view>
				</view>
				<view class="addDetail" @click="addWine">
					增加明细
				</view>
			</view>
            <button type="default" class="order_btn" @click="saveFn()" v-if="options.api">保存</button>
            <auditProcess :value="confirmList" :btnValue="buttons" :isShowBtn="options.api?false:true" @resubmit='resubmits'></auditProcess>	
    	</view>
</template>

<script>
	import approverMsg from "@/component/approverMsg.vue";//审核流程
	import auditProcess from "@/component/auditProcess.vue";//审核流程
	import selectBox from "@/component/selectBox.vue"
	import timeSelector from '@/component/wing-time-selector/wing-time-selector.vue';
	import navigation from "@/component/navigation.vue"
	import sun from '@/utils/sun.js'
	export default {
		components: {
			navigation,
			timeSelector,
			selectBox,
			approverMsg,
			auditProcess
		},
		data() {
			return {
				isEdit:false,
				wine: [
					{   
						wine_text:'',
						wine_id:'',
						wine_amount:"",//数量
						wine_price:"",//金额
						wine_remark:"",//备注
						wineIndex:''
					}
				], // 酒水
				wineList:[],
				options:'',
				confirmList:[],
				confirm:{},//审批信息
			}
		},
		onLoad(options) {
			//审核查看
			if(options.lookApproval){
				this.options= JSON.parse(options.lookApproval)
				this.isEdit =true;
				//查看信息
				this.getDetail(this.options)	
			}
			//添加
			if(options.params){
			   this.options= JSON.parse(options.params);
			   this.getData(this.options)//获取picker				
			}
			
			//查看
			if(options.id){				
			   this.options= options;
			   this.isEdit = true;
			   //查看信息
			   this.getDetail(this.options)			 
			}
		},
		methods: {
            //获取查看信息
			getDetail(e){
			  let that=this										
			  sun.request({
				url: '/h5/order.confirm/detail',
				showLoading: true,
				token:true,
				data:{
					id:e.id,
					type:e.user?'confirm_user':'',
				},
				success(res) {				
					if(res.code==200){								   
					   that.wine=res.data.detail.wine;	
					   that.confirmList=res.data.confirmList;					   
					   that.confirm=res.data.confirm;//代表的是当前审核的信息
					   that.buttons=res.data.buttons;
					   //判断是否可以编辑
					   that.buttons.map((item,index)=>{
						   if(item.id=='update'){
						   	  that.isEdit = false;
						   }
					   })
					   that.wineList=res.data.wineList?res.data.wineList:''
					   that.wine.map((item,index)=>{
						     that.wineList.map((items,indexs)=>{
						     	   if(item.wine_id==items.id){
						     		  item.wine_text=items.title;
									  item.threeIndex=indexs;									 
						     	   }
						        })
						      
					     })
					 }  
				},
				fail(e) {
					uni.showToast({
						icon: "none",
						title: "服务器开小差去啦~",
					})
				}
			  })						 
            },			
            getData(e){
			  let that=this										
			  sun.request({
				url: e.read,
				showLoading: true,
				token:true,
				data:{
					order_id:e.order_id
				},
				success(res) {				
					if(res.code==200){								 
					     that.wineList = res.data.list?res.data.list:'';						
						 that.confirmList = res.data.confirmList?res.data.confirmList:''
					}
				},
				fail(e) {
					uni.showToast({
						icon: "none",
						title: "服务器开小差去啦~",
					})
				}
			  })						 
			},
			//选择酒水
			chooseWine(e){				
				     let arrayIndex =e.currentTarget.dataset.type	 
					 this.wineIndex=e.target.value;
					 this.wine[arrayIndex].wineIndex=e.target.value;
					 this.wine[arrayIndex].wine_text=this.wineList[this.wineIndex].title;
				     this.wine[arrayIndex].wine_id=this.wineList[this.wineIndex].id;
				    this.$forceUpdate()
				},
			//删除酒水
			deleteJiu(indexW){
				this.wine[indexW].wine_id='';
				this.wine[indexW].wine_text=''
				this.wine[indexW].wineIndex=''; 
				this.$forceUpdate()
            },
            //删除酒水
			deleteWine(index){
				this.wine.splice(index, 1);
			},
			//添加酒水
			addWine(){
				this.wine.push({
					wine_text:'',
					wine_id:'',
					wine_amount:"",//数量
					wine_price:"",//金额
					wine_remark:"",//备注
					wineIndex:''
				})
			},
			//删除酒水
			deleteWine(index){
				this.wine.splice(index, 1);
			},
			//提交审核
			saveFn(){			    
				let that=this;			
				sun.request({
					url: that.options.api,
					showLoading: true,
					token:true,
					data:{	
						order_id:that.options.order_id,						
                        wineList:that.wine?JSON.stringify(that.wine):'',
                        },
					success(res) {
					  if(res.code==200){							
							uni.redirectTo({
							 	url:"/pages/order/index"	
							})
							uni.showToast({
								icon:"none",
								title:res.msg
							})										
					  }else{
							 uni.showToast({
								icon:"none",
								title:res.msg
							 })	
					  }
					}
				})																	
            },
            // 编辑提交
			editFn(api,id){
				let that=this;
				sun.request({
					url: api,
					showLoading: true,
					token:true,
					data:{
						order_confirm_id:that.options.id,
						id:id?id:'',
						wineList:that.wine?JSON.stringify(that.wine):'',																	
					},
					success(res) {
					  if(res.code==200){							
							uni.redirectTo({
							 	url:"/pages/order/index"	
							})
							uni.showToast({
								icon:"none",
								title:res.msg
							})										
					  }else{
							 uni.showToast({
								icon:"none",
								title:res.msg
							 })	
					  }
					}
				})
			},
			//底部评论按钮
			resubmits(item){				
				if(item.label=='同意'||item.label=='拒绝'||item.label=='评论'){
					this.commentFn(item)
				}else{
				   this.editFn(item.api,item.id)	
				}
								
			},
			// 编辑提交
			commentFn(e){
				let that=this;
				sun.request({
					url: e.api,
					showLoading: true,
					token:true,
					data:{						
						id:that.options.id?that.options.id:'',						
						content:e.content?e.content:'',
						image:e.image?e.image:'',
					},
					success(res) {
					  if(res.code==200){													
							uni.showToast({
								icon:"none",
								title:res.msg
							})
			               that.getDetail(that.options)																	
					  }else{
							 uni.showToast({
								icon:"none",
								title:res.msg
							 })	
					  }
					}
				})
			},
		}
	}
</script>

<style lang="less">
@import '../common.less';
</style>
